<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/common/tags.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>用户注册</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="Cache-Control" content="no-store" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<link href="${ctx}/resources/css/manage/login.css" rel="stylesheet" type="text/css" />
<script src="${ctx}/resources/js/jquery.min.js"></script>
<script type="text/javascript">
var ctx = '${ctx}';
$(function() {
	$('#register').off('click').click(function(){
		var login = $('#login').val();
		var password = $('#password').val();
		var confirmpassword = $('#confirmpassword').val();
		$('.message').html('');
		if(!!!login) {
			$('#login').focus().addClass('require');
			$('#login').parent().find('.message').html('用户名不能为空');return;
		}
		if(!!!password) {
			$('#password').focus().addClass('require');
			$('#password').parent().find('.message').html('密码不能为空');return;
		}
		if(!!!confirmpassword) {
			$('#confirmpassword').focus().addClass('require');
			$('#confirmpassword').parent().find('.message').html('重复密码不能为空');return;
		}
		if(password != confirmpassword) {
			$('#confirmpassword').focus().addClass('require');
			$('#confirmpassword').parent().find('.message').html('两次密码输入不匹配');return;
		}
		$.post(ctx+'/register.json',$('#registerForm').serialize() ,function(data){
			if(data.result) {
				window.location.href=ctx+"/login.htm";
			}else{
				alert(data.message);
			}
		});
	});
});
</script>
<style>
body {
	background:#fff;
}
.mainbody {
    background: none repeat scroll 0 0 #FEFEFE;
    border: 4px solid #BFD6E1;
    border-radius: 8px;
    margin: 50px auto;
    padding: 30px 20px 40px;
    width: 800px;
}
form {
    margin: 0 0 20px;
}
.mainbody .top {
    border-bottom: 1px dashed #DADADA;
    margin-bottom: 40px;
    padding-bottom: 12px;
}
.form-horizontal > div {
    text-align: center;
    margin: 30px 0;
    height: 30px;
}
form > div > label {
    display: block;
    float: left;
    height: 100%;
    line-height: 35px;
    text-align: right;
    width: 300px;
}
form > div > input {
    display: block;
    height: 100%;
    width: 250px;
    float: left;
}
form > div > span {
    display: block;
    float: left;
    line-height: 35px;
    width: 20px;
}
form .message {
	color:red;
	display:block;
	float:left;
	width:200px;
	line-height:35px;
	height: 35px;
	text-align: left;
}

.register_button{

  border-radius:5px;
  background:#0A985D;
  border:1px solid #0A985D;

}

.mainbody .top .txt{

font-weight:bold;
font-size:20px;

}

</style>
</head>
<body>
	<div class="mainbody">
		<div class="top">
		    <div class="txt">欢迎您注册该系统会员，如果您已拥有账户，则可在此 <a href="${ctx}/login.htm">登录</a>
		    </div>
		</div>
		<form class="form-horizontal" method="post" action="" id="registerForm">
			<div>
				<label>用户名：</label><input type="text" name="login" id="login" class="required"/><span style="color:red;">*</span><span class="message"></span>
			</div>
			<div>
				<label>密码：</label><input type="password" name="password" id="password" class="required"/><span style="color:red;">*</span><span class="message"></span>
			</div>
			<div>
				<label>重复密码：</label><input type="password" name="confirmpassword" id="confirmpassword" class="required"/><span style="color:red;">*</span><span class="message"></span>
			</div>
		</form>
		<button class="register_button" style="height: 35px;margin-left: 330px;width: 200px;" id="register">注册</button>
	</div>
</body>
</html>
